<template>
	<view class="uni_box home">
		<navbar title='达人商单'>
		</navbar>
		<view class="content">
			<view class="daone">
				<view class="zone">
					<text class="datit">已存草稿</text>
				</view>
				<text class="tian">编辑探店商单</text>
				<text class="rushi">派单人：<text class="ptit">ADOH 可以</text> [服务商]</text>
				
				
				<view class="fview">
					<view class="mitem">
						<text class="itemname hui">商单亮点</text>
						<u-input class="shuru" v-model="name" type="text" @input="poiinput" @blur="poiblur" :border="false" :placeholder-style="placeholderStyle" placeholder="吸引达人报名的亮点，10个字以内"/>
					
					</view>
					<view class="shouxian"></view>
					<view class="shoufang">
						<view class="shouone">
							<text class="shoutit">探店人数</text>
							<text class="fanname ml">反选人数达标自动截止报名</text>
						</view>
						<view class="zflex">
							<view class="zfan">
								账号反选
							</view>
							<view class="mitem" style="flex: 1;margin-bottom: 0;">
								<view class="lxuan"></view>
								<text class="itemname" style="border-right: none;">探店号</text>
								<view class="jia">
									<image class="jianicon" src="@/pages_subject/static/img/jian.png" mode="" />
								</view>
								<view class="jiashu">
									<u-input class="shurutwo" input-align="center" :clearable="false" v-model="num" type="number" :border="false" :placeholder-style="placeholderStyle" placeholder="请输入"/>
								</view>
								<view class="jia">
									<image class="jianicon" src="@/pages_subject/static/img/jia.png" mode="" />
								</view>
								<text class="danwei">个</text>
							</view>
						</view>
						<text class="fanmiao">反选时，被拒账号名额将自动释放，可继续邀请达人报名</text>
						<view class="zflex">
							<view class="mitem" style="flex: 1;margin-bottom: 0;">
								<text class="itemname" style="border-right: none;">最大报名数</text>
								<view class="jia">
									<image class="jianicon" src="@/pages_subject/static/img/jian.png" mode="" />
								</view>
								<view class="jiashu">
									<u-input class="shurutwo" input-align="center" :clearable="false" v-model="num" type="number" :border="false" :placeholder-style="placeholderStyle" placeholder="请输入"/>
								</view>
								<view class="jia">
									<image class="jianicon" src="@/pages_subject/static/img/jia.png" mode="" />
								</view>
								<text class="danwei">个，进行反选</text>
							</view>
						</view>
						<view class="mitem" style="margin-bottom: 0;">
							<view class="lxuan"></view>
							<text class="itemname" style="width: 100px;">报名截止日期</text>
							<text class="itemval hui">设置截止日期</text>
							<!-- <u-input class="shuru" v-model="name" type="text" :border="false" :placeholder-style="placeholderStyle" placeholder="设置截止日期"/> -->
							
						</view>
					</view>
					<view class="shouxian"></view>
					<view class="shoufang">
						<view class="shouone">
							<text class="shoutit">达人账号</text>
						</view>
						<view class="zflex">
							<view class="mitem" style="flex: 1;margin-bottom: 0;">
								
								<text class="itemname chename" style="border-right: none;width: 62px;">带货力</text>
								<view class="dengnav">Lv3</view>
								<text class="che">车马费</text>
								<view class="jia">
									<image class="jianicon" src="@/pages_subject/static/img/jian.png" mode="" />
								</view>
								<view class="jiashu" style="width: 36px;">
									<u-input class="shurutwo" input-align="center" :clearable="false" v-model="num" type="number" :border="false" :placeholder-style="placeholderStyle" placeholder="请输入"/>
								</view>
								<view class="jia">
									<image class="jianicon" src="@/pages_subject/static/img/jia.png" mode="" />
								</view>
								<text class="danwei chename">元</text>
							</view>
						</view>
						<view class="zflex">
							<view class="mitem mictive" style="flex: 1;margin-bottom: 0;">
								
								<text class="itemname" style="border-right: none;width: 62px;">带货力</text>
								<view class="dengnav">Lv3</view>
								<text class="che">车马费</text>
								<view class="jia">
									<image class="jianicon" src="@/pages_subject/static/img/jian.png" mode="" />
								</view>
								<view class="jiashu" style="width: 36px;">
									<u-input class="shurutwo" input-align="center" :clearable="false" v-model="num" type="number" :border="false" :placeholder-style="placeholderStyle" placeholder="请输入"/>
								</view>
								<view class="jia">
									<image class="jianicon" src="@/pages_subject/static/img/jia.png" mode="" />
								</view>
								<text class="danwei chename">元</text>
							</view>
						</view>

						<view class="zflex">
							<view class="mitem mictive" style="flex: 1;margin-bottom: 0;">
								
								<text class="itemname" style="border-right: none;">内容力等级</text>
								
								<view class="jia">
									<image class="jianicon" src="@/pages_subject/static/img/jian.png" mode="" />
								</view>
								<view class="jiashu" style="width: 45px;text-align: center;">
									<text class="itemval">Lv2</text>
									<!-- <u-input class="shurutwo" input-align="center" :clearable="false" v-model="num" type="number" :border="false" :placeholder-style="placeholderStyle" placeholder="请输入"/> -->
								</view>
								<view class="jia">
									<image class="jianicon" src="@/pages_subject/static/img/jia.png" mode="" />
								</view>
								<text class="danwei chename">及以上</text>
							</view>
						</view>
						<view class="zflex">
							<view class="mitem" style="flex: 1;margin-bottom: 0;">
								
								<text class="itemname" style="border-right: none;width: 100px;">粉丝数须大于</text>
								
								<view class="jia">
									<image class="jianicon" src="@/pages_subject/static/img/jian.png" mode="" />
								</view>
								<view class="jiashu" style="width: 45px;text-align: center;">
									<!-- <text class="itemval">Lv2</text> -->
									<u-input class="shurutwo" input-align="center" :clearable="false" v-model="num" type="number" :border="false" :placeholder-style="placeholderStyle" placeholder="请输入"/>
								</view>
								<view class="jia">
									<image class="jianicon" src="@/pages_subject/static/img/jia.png" mode="" />
								</view>
							</view>
						</view>
						<view class="zflex">
							<view class="mitem mictive" style="flex: 1;margin-bottom: 0;">
								
								<text class="itemname" style="border-right: none;width: 100px;">集中探店时间</text>
								<view class="diitemval">
									<image class="dinicon" src="@/pages_subject/static/img/dinicon.png" mode="" />
									<text class="itemval">广东省 广州市</text>
								</view>
							</view>
						</view>
						<view class="mitem" style="border-radius: 9px 9px 9px 0;margin-bottom: 0;">
							<view class="lxuan" style="border-radius: 9px 0px 0px 0px;"></view>
							<text class="itemname" style="width: 105px;">集中探店时间</text>
							<view class="timeval border-right">
								<text class="itemval hui">选择日期</text>
							</view>
							<view class="timeval">
								<text class="itemval hui">选择时间</text>
							</view>
						</view>
						<view class="mitem" style="border-radius: 0 9px 9px 9px;border-top: 1px solid rgba(248, 248, 253, 1);margin-bottom: 0;">
							<view class="lxuan" style="border-radius:0 0 0 9px;"></view>
							<text class="itemname" style="width: 105px;">自报日期范围</text>
							<view class="timeval">
								<text class="itemval hui">开始日期</text>
							</view>
							<text class="danwei" style="margin: 0;">至</text>
							<view class="timeval">
								<text class="itemval hui">结束日期</text>
							</view>
						</view>
					</view>
					<view class="shouxian"></view>
					<view class="shoufang">
						<view class="shouone">
							<text class="shoutit">视频正片</text>
						</view>
						<view class="zflex">
							<view class="mitem" style="flex: 1;margin-bottom: 0;">
								<!-- <view class="lxuan"></view> -->
								<text class="itemname" style="border-right: none;">镜头数大于</text>
								<view class="jia">
									<image class="jianicon" src="@/pages_subject/static/img/jian.png" mode="" />
								</view>
								<view class="jiashu" style="width: 36px;">
									<u-input class="shurutwo" input-align="center" :clearable="false" v-model="num" type="number" :border="false" :placeholder-style="placeholderStyle" placeholder="请输入"/>
								</view>
								<view class="jia">
									<image class="jianicon" src="@/pages_subject/static/img/jia.png" mode="" />
								</view>
								<text class="danwei">个</text>
							</view>
							<view class="zfantwo">
								热榜BGM
							</view>
						</view>
						<view class="zflex">
							<view class="mitem" style="flex: 1;margin-bottom: 0;">
								<!-- <view class="lxuan"></view> -->
								<text class="itemname" style="border-right: none;">正片时长</text>
								<view class="jia">
									<image class="jianicon" src="@/pages_subject/static/img/jian.png" mode="" />
								</view>
								<view class="jiashu" style="width: 36px;">
									<u-input class="shurutwo" input-align="center" :clearable="false" v-model="num" type="number" :border="false" :placeholder-style="placeholderStyle" placeholder="请输入"/>
								</view>
								<view class="jia">
									<image class="jianicon" src="@/pages_subject/static/img/jia.png" mode="" />
								</view>
								<text class="danwei">秒</text>
							</view>
							<view class="zfantwo">
								必须真人录音
							</view>
						</view>
						<view class="mitem" style="margin-bottom: 0;">
							<!-- <view class="lxuan"></view> -->
							<text class="itemname" style="width: 100px;">最晚交片日期</text>
							<text class="itemval hui">设置截止日期</text>
							<!-- <u-input class="shuru" v-model="name" type="text" :border="false" :placeholder-style="placeholderStyle" placeholder="设置截止日期"/> -->
							
						</view>
					</view>
					<view class="shouxian"></view>
					<view class="shoufang">
						<view class="shouone">
							<text class="shoutit">团购信息</text>
						</view>
						<view class="mitem">
							<view class="lxuan"></view>
							<text class="itemname">主推套餐</text>
							<u-input class="shuru" v-model="name" type="text" :border="false" :placeholder-style="placeholderStyle" placeholder="价格+套餐"/>
							<text class="zhantie">粘贴</text>
						</view>
						<view class="zflex">
							<view class="mitem" style="flex: 1;margin-bottom: 0;">
								<view class="lxuan"></view>
								<text class="itemname" style="border-right: none;">CPS佣金</text>
								<view class="jia">
									<image class="jianicon" src="@/pages_subject/static/img/jian.png" mode="" />
								</view>
								<view class="jiashu">
									<text class="itemval" style="text-align: center;">25%</text>
									<!-- <u-input class="shurutwo" input-align="center" :clearable="false" v-model="num" type="number" :border="false" :placeholder-style="placeholderStyle" placeholder="请输入"/> -->
								</view>
								<view class="jia">
									<image class="jianicon" src="@/pages_subject/static/img/jia.png" mode="" />
								</view>
							</view>
							<view class="zfantwo han">
								含餐
							</view>
							<view class="zfantwo han">
								含住
							</view>
						</view>
						<view class="mitem">
							<text class="itemname hui">必带话题</text>
							<u-input class="shuru" v-model="name" type="text" :border="false" :placeholder-style="placeholderStyle" placeholder="#达人推荐 #团购"/>
							<text class="zhantie">粘贴</text>
						</view>
						<view class="mitem">
							<text class="itemname hui">素材链接</text>
							<u-input class="shuru" v-model="name" type="text" maxlength="300" :border="false" :placeholder-style="placeholderStyle" placeholder="建议使用阿里云网盘"/>
							<text class="zhantie">粘贴</text>
						</view>
						
						<view class="mitem" style="height: auto;min-height: 50px;margin-bottom: 0;">
							<text class="itemname hui" style="border-right: none;">补充信息</text>
							<view class="buchong">
								<u-input class="shuruwen" v-model="name" maxlength="500" type="textarea" :border="false" :clearable="false" :placeholder-style="placeholderStyle" placeholder="请输入补充信息"/>
								<text class="zhantie">粘贴</text>
							</view>
							
						</view>
					</view>
					
					<view class="shouxian"></view>
					<view class="shoufang">
						<view class="shouone">
							<text class="shoutit">结算方式</text>
							<text class="shoumiao">自行向达人结算转账方式</text>
						</view>
						<view class="shoukuan">
							<view class="shouleft">
								<view class="shouitem shouactive">
									微信收款码
								</view>
								<view class="shouitem">
									支付宝收款码
								</view>
								<view class="shouitem">
									微信群转账
								</view>
							</view>
							<view class="shouright">
								<text class="cname">上传此商单</text>
								<text class="cname">微信群二维码</text>
							</view>
						</view>
					</view>	

				</view>
			</view>
		
			<view class="datwo">
				<view class="dabtns">
					<view class="rightbtns" @click="getsuccess">
						继续
					</view>
				</view>
				<text class="tian">派单即同意《达人商单用户协议》</text>
			</view>
		</view>
	</view>
</template>

<script>
import Clipboard from '@/utils/clipboard.js';
	export default {
		data() {
			return {
				name:'',
				isshuru:false,
				num:'1',
				placeholderStyle:'color:#999999'
			}
		},
		onLoad() {
			
		},
		onShow() {
		},
		methods: {
			pasteText(e){
				console.log(e)
				uni.getClipboardData({
					success: (res) => {
						console.log(res)
					}
				})	
				// Clipboard.pasteTextToElement('#inputElementId');
			},
			poiinput(e){
				// console.log(e)
				if(e){
					this.isshuru = true
				}
			},
			poiblur(e){
				// console.log(e)
				this.isshuru = false
			},
			getsuccess(){
				this.navrouter("/pages_subject/twoPage/Pai/TSucess");
			}
		}
	}
</script>

<style lang="scss" scoped>
	page{
		background-color: #f8f8fd;
	}
	.content{
		background-color: #f8f8fd;
		.xian{
			border: 1px dashed rgba(232, 232, 232, 1);
			display: block;
			margin: 20px 0 10px;
		}
		.daone{
			padding: 0px 20px 120px;
			.zone{
				display: flex;
				align-items: center;
				justify-content: flex-end;
			}
			.datit{
				margin-left: auto;
				font-size: 12px;
				font-weight: 400;
				letter-spacing: 0px;
				line-height: 17.38px;
				color: rgba(119, 102, 231, 1);
			}
			.tannav{
				margin: 40rpx auto;
				display: flex;
				align-items: center;
				justify-content: center;
				width: 105px;
				height: 105px;
				opacity: 1;
				border-radius: 12px;
				background: rgba(255, 255, 255, 1);
				flex-direction: column;
				border: 2px solid rgba(119, 102, 231, 1);
				.fang{
					width: 36px;
					height: 36px;
					margin-bottom: 10px;
				}
				text{
					font-size: 14px;
					font-weight: 400;
					color: rgba(51, 51, 51, 1);
				}
			}
			.tian{
				display: block;
				text-align: center;
				font-size: 30px;
				font-weight: 500;
				letter-spacing: 0px;
				line-height: 43.44px;
				margin: 2px 0 2px;
				color: rgba(51, 51, 51, 1);
			}
			.rushi{
				font-size: 14px;
				font-weight: 400;
				display: block;
				text-align: center;
				color: rgba(153, 153, 153, 1);
			}
			.ptit{
				color: rgba(119, 102, 231, 1);
			}
			
			.fview{
				margin-top: 20px;
				.lxuan{
					width: 10px;
					height: 100%;
					opacity: 1;
					border-radius: 9px 0px 0px 9px;
					background: rgba(119, 102, 231, 1);
					box-shadow: 0px 6px 10px  rgba(119, 102, 231, 0.08);
					left: 0;
					top: 0;
					position: absolute;
				}
				.mitem{
					margin-bottom: 10px;
					border-radius: 9px;
					background: rgba(255, 255, 255, 1);
					box-shadow: 0px 6px 10px  rgba(119, 102, 231, 0.08);
					display: flex;
					flex-direction: row;
					align-items: center;
					padding: 2px 15px 2px 10px;
					// min-height: 50px;
					height: 50px;
					position: relative;

					.itemname{
						width: 70px;
						border-right: 1px solid rgba(232, 232, 252, 1);
						text-align: center;
						display: inline-block;
						font-size: 14px;
						font-weight: 400;
						color: rgba(51, 51, 51, 1);
						margin-right: 10px;
					}
					
					.iteminput{
						margin-right: 10px;
					}
					.itemval{
						font-size: 14px;
						font-weight: 400;
						color: rgba(51, 51, 51, 1);
						// max-width: 65%;
						flex: 1;
						display: inline-block;
					}
					.xiao{
						font-size: 11px;
					}
					
					.dinicon{
						width: 18px;
						height: 18px;
					}
					.zhantie{
						margin-left: auto;
						font-size: 12px;
						font-weight: 400;
						text-decoration-line: underline;
						color: rgba(119, 102, 231, 1);
					}
					.zise{
						color: rgba(119, 102, 231, 1);
					}
					.shuru{
						flex: 1;
						margin-right: 20rpx;
					}
					.shurutwo{
						flex: 1;
					}
					.hui{
						color: #999999;
					}


					.daihuoli{
						display: flex;
						flex-direction: row;
						align-items: center;
						.jia{
							width: 36px;
							height: 36px;
							opacity: 1;
							border-radius: 9px;
							background: rgba(248, 248, 253, 1);
							display: flex;
							align-items: center;
							justify-content: center;
							position: relative;
							.jianicon{
								width: 18px;
								height: 18px;

							}
						}
						.dengname{
							display: inline-block;
							margin: 0 10px;
							font-size: 14px;
							font-weight: 400;
							color: rgba(119, 102, 231, 1);
						}
					}
					.dengji{
						margin-left: 10px;
						display: flex;
						flex-direction: row;
						align-items: center;
						.dengtu{
							font-size: 14px;
							font-weight: 400;
							color: rgba(51, 51, 51, 1);
							display: inline-block;
							margin-right: 5px;
						}
						.dengchaun{
							width: 42px;
							height: 21px;
							opacity: 1;
							border-radius: 3px;
							background: rgba(248, 248, 253, 1);
							box-shadow: 0px 0px 3px  rgba(119, 102, 231, 0.63);
							display: flex;
							align-items: center;
							justify-content: center;
							.chauntu{
								width: 12px;
								height: 12px;
							}
						}
					}
					.jia{
						width: 36px;
						height: 36px;
						opacity: 1;
						border-radius: 9px;
						background: rgba(248, 248, 253, 1);
						display: flex;
						align-items: center;
						justify-content: center;
						position: relative;
						.jianicon{
							width: 18px;
							height: 18px;

						}
					}
					.jiashu{
						width: 45px;
						display: flex;
						align-items: center;
						justify-content: center;
						margin: 0 5rpx;
					}
					.dengname{
						display: inline-block;
						margin: 0 10px;
						font-size: 14px;
						font-weight: 400;
						color: rgba(119, 102, 231, 1);
					}
					.danwei{
						font-size: 14px;
						font-weight: 400;
						color: rgba(51, 51, 51, 1);
						display: inline-block;
						margin-left: 3px;
					}
					.dengnav{
						width: 45px;
						height: 50px;
						opacity: 1;
						background: rgba(220, 214, 255, 1);
						display: flex;
						align-items: center;
						justify-content: center;
						font-size: 14px;
						font-weight: 700;
						color: rgba(255, 255, 255, 1);
						margin-right: 10px;
					}
					.che{
						font-size: 14px;
						font-weight: 400;
						color: rgba(153, 153, 153, 1);
						display: inline-block;
						margin-right: 10px;
					}
					.chename{
						color: rgba(153, 153, 153, 1);
					}

					.diitemval{
						display: flex;
						flex-direction: row;
						align-items: center;
						.dinicon{
							margin-right: 5px;
							width: 20px;
							height: 21px;
						}
					}
					.timeval{
						width: 92px;
						// padding: 0 10rpx 0 20rpx;
						padding-left: 20rpx;
						// text-align: center;
					}
					.border-right{
						border-right: 1px solid rgba(232, 232, 252, 1);
					}

					.buchong{
						display: flex;
						flex-direction: row;
						flex: 1;
						padding-top: 20rpx;
					}
					.shuruwen{
						height: 100px;
						flex: 1;
					}
				}
				.mictive{
					.dengnav{
						background: rgba(119, 102, 231, 1);
						color: #ffffff;
						font-weight: 700;
					}
					.che{
						color: rgba(51, 51, 51, 1);
					}	
					.chename{
						color: rgba(51, 51, 51, 1);
					}
					.jiashu{
						/deep/.uni-input-input {
							color: rgba(119, 102, 231, 1);
							font-weight: 700;
						}
						.shurutwo{
							
							
						}
					}
				}
				.shouxian{
					border: 1px dashed rgba(232, 232, 232, 1);
					display: block;
					margin: 20px 0 13px;
				}
				.shoufang{
					display: flex;
					flex-direction: column;
					
					.shouone{
						display: flex;
						flex-direction: row;
						margin-bottom: 10px;
						align-items: flex-end;
						.shoutit{
							font-size: 14px;
							font-weight: 400;
							color: rgba(51, 51, 51, 1);
							
						}
						.fanname{
							font-size: 12px;
							font-weight: 400;
							color: rgba(153, 153, 153, 1);
						}
						.shoumiao{
							display: inline-block;
							margin-left: 20rpx;
							font-size: 12px;
							font-weight: 400;
							position: relative;
							top: -1px;
							color: rgba(153, 153, 153, 1);
						}
						.zi{
							color: rgba(119, 102, 231, 1);
						}
					}
					.shoutwo{
						display: flex;
						flex-direction: row;
						.shouchuan{
							width: 90px;
							height: 130px;
							margin-right: 20px;
							opacity: 1;
							border-radius: 9px 9px;
							background: rgba(255, 255, 255, 1);
							box-shadow: 0px 6px 10px  rgba(119, 102, 231, 0.08);
							.schuan{
								width: 100%;
								height: 90px;
								display: flex;
								align-items: center;
								justify-content: center;
								.jijiang{
									font-size: 12px;
									font-weight: 400;
									color: rgba(153, 153, 153, 1);
								}
							}
							.sshuoming{
								height: 40px;
								width: 100%;
								display: flex;
								align-items: center;
								justify-content: center;
								font-size: 14px;
								font-weight: 400;
								color: #999999;
								border-top: 2px solid #eee;
							}
						}
						
						.sative{
							.schuan{
								.jijiang{
									text-decoration-line: underline;
									color: rgba(119, 102, 231, 1);
								}
							}
						}
					}
					.shoukuan{
						display: flex;
						flex-direction: row;
						.shouleft{
							display: flex;
							flex-direction: column;
							.shouitem{
								padding: 10px;
								height:40px;
								border-radius: 9px;
								background: rgba(255, 255, 255, 1);
								box-shadow: 0px 6px 10px  rgba(119, 102, 231, 0.08);
								margin-bottom: 10px;
								display: flex;
								align-items: center;
								justify-content: center;
								font-size: 14px;
								font-weight: 400;
								color: rgba(153, 153, 153, 1);
							}
							.shouactive{
								border: 1px solid rgba(119, 102, 231, 1);
								color: rgba(119, 102, 231, 1);
							}
						}
						.shouright{
							flex: 1;
							height: 140px;
							opacity: 1;
							border-radius: 9px;
							background: rgba(255, 255, 255, 1);
							box-shadow: 0px 6px 10px  rgba(119, 102, 231, 0.08);
							display: flex;
							align-items: center;
							flex-direction: column;
							justify-content: center;
							margin-left: 20px;
							.cname{
								font-size: 14px;
								color: rgba(153, 153, 153, 1);
								font-weight: 400;
								text-decoration-line: underline;
							}
						}
					}
					.lingqie{
						display: flex;
						flex-direction: row;
						flex-wrap: wrap;
						.qieitem{
							border-radius: 6px;
							background: rgba(255, 255, 255, 1);
							box-shadow: 0px 6px 10px  rgba(119, 102, 231, 0.08);
							padding: 10px 10px;
							font-size: 14px;
							font-weight: 400;
							margin-right: 10px;
							margin-bottom: 10px;
							color: rgba(153, 153, 153, 1);
							position: relative;
							.xing{
								color: #7766e7;
								position: absolute;
								right: 3px;
								top: 1px;
								display: none;
							}
						}
						.qieactive{
							border: 1px solid #7766e7;
							color: rgba(51, 51, 51, 1);
							.xing{
								display: inline-block;
							}
						}
					}
				}
			}
		}
	}
	.datwo{
		height: 113px;
		opacity: 1;
		border-radius: 9px;
		background: rgba(248, 248, 253, 1);
		box-shadow: 0px -6px 10px  rgba(119, 102, 231, 0.08);
		position: fixed;
		width: 100%;
		bottom: 0;
		z-index: 100;
		padding: 10px 20px 30px;
		display: flex;
		flex-direction: column;
		align-items: center;

		.dabtns{
			display: flex;
			flex-direction: row;
			width: 100%;
			.leftbtns{
				width: 160px;
				height: 45px;
				opacity: 1;
				border-radius: 50px 0px 0px 50px;
				background: rgba(255, 255, 255, 1);
				box-shadow: 0px 0px 3px  rgba(119, 102, 231, 0.63);
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: center;
				.dui{
					margin-right: 5px;
					width: 18px;
					height: 18px;
				}
				.zhangname{
					font-size: 12px;
					font-weight: 400;
					color: rgba(119, 102, 231, 1);
				}
			}
			.rightbtns{
				width: 100%;
				height: 45px;
				opacity: 1;
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: center;
				border-radius:50px;
				background: linear-gradient(90deg, rgba(119, 102, 231, 1) 0%, rgba(121, 72, 234, 1) 100%);
				box-shadow: 0px 0px 3px  rgba(119, 102, 231, 0.63);
				font-size: 16px;
				font-weight: 700;
				color: rgba(255, 255, 255, 1);
			}
		}
		.tian{
			display: block;
			text-align: center;
			font-size: 12px;
			font-weight: 400;
			color: rgba(153, 153, 153, 1);
			margin-top: 20rpx;

		}
	}
	.zflex{
		display: flex;
		flex-direction: row;
		margin-bottom: 20rpx;
	}
	.fanmiao{
		font-size: 12px;
		font-weight: 400;
		color: rgba(153, 153, 153, 1);
		display: block;
		margin-bottom: 20rpx;
	}
	.zfan{
		width: 84px;
		height: 50px;
		opacity: 1;
		border-radius: 9px;
		background: rgba(255, 255, 255, 1);

		border: 1px solid rgba(119, 102, 231, 1);

		box-shadow: 0px 6px 10px  rgba(119, 102, 231, 0.08);
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 14px;
		font-weight: 400;
		line-height: 20.27px;
		color: rgba(51, 51, 51, 1);
		margin-right: 10px;
	}
	.zfantwo{
		width: 120px;
		height: 50px;
		display: flex;
		align-items: center;
		justify-content: center;
		margin-right: 0;
		margin-left: 10px;
		border-radius: 9px;
		background: rgba(255, 255, 255, 1);
		box-shadow: 0px 6px 10px  rgba(119, 102, 231, 0.08);
		font-size: 13px;
		font-weight: 400;
		color: rgba(153, 153, 153, 1);

	}
	.han{
		width: 48px;
		margin-left: 10px;
	}
	.guazai{
		position: relative;
		.guazhan{
			position: relative;
			margin-top: -10px;
			width: 100%;
			height: 360px;
			opacity: 1;
			border-radius: 9px;
			background: rgba(255, 255, 255, 1);
			padding: 10px 20px;
			box-shadow: 0px 6px 10px  rgba(119, 102, 231, 0.08);
			.guaname{
				font-size: 12px;
				font-weight: 400;
				color: rgba(153, 153, 153, 1);
			}
			.guaxian{
				border: 1px dashed rgba(232, 232, 232, 1);
				position: relative;
				margin-top: 10px;
			}
			.guaadress{
				max-height: 320px;
				position: relative;
				.adlist{
					padding: 10px 0;
					border-bottom: 1px dashed rgba(232, 232, 232, 1);
					display: flex;
					flex-direction: row;
					align-items: center;
					.adleft{
						width: 85%;
						display: flex;
						flex-direction: column;
						.ruiname{
							font-size: 14px;
							font-weight: 400;
							color: rgba(51, 51, 51, 1);
						}
						.ruidi{
							display: inline-block;
							max-width: 100%;
							font-size: 12px;
							font-weight: 400;
							color: rgba(153, 153, 153, 1);

						}
					}
					.gous{
						margin-left: auto;
						width: 16px;
						height: 16px;
					}
				}
			}
			
		}
	}
	.botyin{
		width: 100%;
		position: absolute;
		bottom: 0;
		height: 40px;
		opacity: 1;
		left: 0;
		border-radius: 0px 0px 9px 9px;
		background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
	}
</style>
